Research
Security News
Quasar RAT Disguised as an npm Package for Detecting Vulnerabilities in Ethereum Smart Contracts
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
webpack-virtual-modules
Advanced tools
The webpack-virtual-modules package allows developers to inject virtual files into the webpack module system. This can be particularly useful for dynamically generating modules or simulating files during the build process without actually writing them to disk.
Dynamic Module Creation
This feature allows developers to create virtual modules that can be used as if they were actual files. This is useful for testing or when certain modules need to be generated on the fly.
const VirtualModulesPlugin = require('webpack-virtual-modules');
const virtualModules = new VirtualModulesPlugin({
'node_modules/my-virtual-module.js': 'module.exports = "This is a virtual module";'
});
// Webpack configuration
module.exports = {
plugins: [virtualModules]
};
Simulating File Changes
This feature enables the simulation of file changes during the webpack build process. It can be used to trigger hot module replacement (HMR) or to test how changes in modules affect the build.
const VirtualModulesPlugin = require('webpack-virtual-modules');
const virtualModules = new VirtualModulesPlugin();
virtualModules.writeModule('node_modules/my-virtual-module.js', 'module.exports = "Updated virtual module content";');
Similar to webpack-virtual-modules, memory-fs allows for the creation of a virtual file system. However, it is more general-purpose and can be used outside of webpack for other types of in-memory file storage. It does not integrate directly with webpack's internal mechanisms as seamlessly as webpack-virtual-modules.
Webpack Virtual Modules is a plugin that allows for dynamical generation of in-memory virtual modules for JavaScript builds created with webpack. When virtual module is created all the parent virtual dirs that lead to the module filename are created too. This plugin supports watch mode meaning any write to a virtual module is seen by webpack as if a real file stored on disk has changed.
Use NPM or Yarn to install Webpack Virtual Modules as a development dependency:
# with NPM
npm install webpack-virtual-modules --save-dev
# with Yarn
yarn add webpack-virtual-modules --dev
You can use Webpack Virtual Modules with webpack 5, 4 and 3. The examples below show the usage with webpack 5 or 4. If you want to use our plugin with webpack 3, check out a dedicated doc:
Require the plugin in the webpack configuration file, then create and add virtual modules in the plugins
array in the
webpack configuration object:
var VirtualModulesPlugin = require('webpack-virtual-modules');
var virtualModules = new VirtualModulesPlugin({
'node_modules/module-foo.js': 'module.exports = { foo: "foo" };',
'node_modules/module-bar.js': 'module.exports = { bar: "bar" };'
});
module.exports = {
// ...
plugins: [
virtualModules
]
};
You can now import your virtual modules anywhere in the application and use them:
var moduleFoo = require('module-foo');
// You can now use moduleFoo
console.log(moduleFoo.foo);
You can generate virtual modules dynamically with Webpack Virtual Modules.
Here's an example of dynamic generation of a module. All you need to do is create new virtual modules using the plugin
and add them to the plugins
array. After that, you need to add a webpack hook. For using hooks, consult webpack
compiler hook documentation.
var webpack = require('webpack');
var VirtualModulesPlugin = require('webpack-virtual-modules');
// Create an empty set of virtual modules
const virtualModules = new VirtualModulesPlugin();
var compiler = webpack({
// ...
plugins: [
virtualModules
]
});
compiler.hooks.compilation.tap('MyPlugin', function(compilation) {
virtualModules.writeModule('node_modules/module-foo.js', '');
});
compiler.watch();
In other module or a Webpack plugin, you can write to the module module-foo
whatever you need. After this write,
webpack will "see" that module-foo.js
has changed and will restart compilation.
virtualModules.writeModule(
'node_modules/module-foo.js',
'module.exports = { foo: "foo" };'
);
This project is inspired by virtual-module-webpack-plugin.
Copyright © 2017 SysGears INC. This source code is licensed under the MIT license.
FAQs
Webpack Virtual Modules
The npm package webpack-virtual-modules receives a total of 9,578,849 weekly downloads. As such, webpack-virtual-modules popularity was classified as popular.
We found that webpack-virtual-modules demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.